<template>
  <div>
    <meta http-equiv="Access-Control-Allow-Origin" content="*">
    <h3>快递接口测试</h3>
    <el-input v-model="findNumber"></el-input>
    <el-button @click="findByNumber" type="primary">提交测试</el-button>
    <div :style="showBox">
      <el-timeline>
        <el-timeline-item
          v-for="(activity, index) in traces"
          :key="index"
          :timestamp="activity.time"
        >
          {{ activity.desc }}
        </el-timeline-item>
      </el-timeline>
    </div>
  </div>
</template>
<script>
export default {
  data () {
    return {
      showBox: 'display:none',
      findNumber: '',
      progressInfo: [],
      traces: []
    }
  },
  methods: {
    async findByNumber () {
      const { data: res } = await this.$http.get('http://127.0.0.1/travel/KuaiDiServlet?number=' + this.findNumber)
      if (res.code !== 200) {
        return this.$message.error('获取失败')
      }
      this.progressInfo = res.data
      this.traces = res.data.traces
      this.showBox = 'display:block'
    }
  }
}
</script>
<style lang="less" scoped>

</style>
